<script setup>
import { ref } from "vue";
import { useRouter } from "vue-router";
import { resetPwdApi } from "@/apis/user";
import { Message } from "tdesign-mobile-vue";
import { useUserStore } from "@/stores/user";
const formData = ref({
    password: "",
    new_password: "",
    confirm: ""
})
const store = useUserStore();
const router = useRouter();
function resetPwdFunc() {
    resetPwdApi(formData.value)
        .then(res => {
            const { code, msg } = res.data;
            if (code === 1) {
                Message.success({
                    content: msg,
                    context: document.querySelector('main'),
                    duration: 2000,
                    offset: [8, 8]
                });
                setTimeout(() => {
                    store.userLogout();
                    router.replace({
                        name: 'login'
                    })
                }, 2000);
            } else {
                Message.error({
                    content: msg,
                    context: document.querySelector('main'),
                    duration: 2000,
                    offset: [8, 8]
                });
            }
        })
}
</script>
<template>
    <main>
        <t-form @submit="resetPwdFunc" :labelWidth="100">
            <t-cell-group title="修改密码">
                <t-form-item label="原密码">
                    <t-input borderless v-model="formData.pwd" type="password"></t-input>
                </t-form-item>
                <t-form-item label="新密码">
                    <t-input borderless v-model="formData.new" type="password"></t-input>
                </t-form-item>
                <t-form-item label="确认新密码">
                    <t-input borderless v-model="formData.confirm" type="password"></t-input>
                </t-form-item>
            </t-cell-group>
            <div style="padding: 8px;">
                <t-button theme="primary" block type="submit">保存</t-button>
            </div>
        </t-form>
    </main>
</template>